import { View, Image, Button } from '@tarojs/components'
import Icon from 'components/Icon'
import Tag from 'components/Tag'
import s from './index.module.scss'
import Taro from '@tarojs/taro'
import dayjs from 'dayjs'
import Card from "components/Card";
import {navigateToAlbum} from "../../Album/items/AlbumCard";
import getSystemInfo from "../../../../utils/getSystemInfo";


require('dayjs/locale/zh-cn')
const relativeTime = require('dayjs/plugin/relativeTime')

dayjs.extend(relativeTime)
dayjs.locale('zh-cn')

type Level = 'normal' | 'important' | 'must' | 'low' | 'new'

export interface Article {
  _id: string,
  title: string,
  time: number | string,
  url: string,
  view_count: number,
  description: string,
  /**
   * React、TypeScript、Vue
   */
  tags: string[],
  /**
   * album id
   */
  album_id: string,
  album_name: string,
  author: string,
  author_id: string,
  type: Level,
  ad?: boolean,
  /** 是否需要验证权限 */
  verify?: boolean,
  selected: boolean,
  onClick: () => any
}

/**
 * 大约一个月的时间差
 */
const timedis = 2929017618

const ArticleItem = (props: Article) => {
  const {title, description, author, time, type, url, album_name, album_id, selected, onClick} = props
  const info = getSystemInfo()

  const __title = encodeURIComponent(title)
  const __url = encodeURIComponent(url)
  
  function jumptoWebview() {
    let __path = `/pages/webview/index?url=${__url}&title=${__title}`;
    // if (type == 'important') {
    //   let date = dayjs().format('YYYYMMDD')
    //   const cache = Taro.getStorageSync(`adcount:${date}`) || 0
    //   let __count = parseInt(cache);
    //   if (__count < 6) {
    //     __path = `/pages/adview/index?url=${__url}&title=${__title}`;
    //   }
    // }
    onClick && onClick()
    Taro.navigateTo({
      url: __path
    })
  }

  const __jumptoAlbum = (e) => {
    e.stopPropagation()
    navigateToAlbum(album_name, album_id)
  }

  let timeStr = ''
  if (Date.now() - dayjs(time).unix() > timedis) {
    timeStr = dayjs(time).format('YYYY.MM.DD')
  } else {
    // @ts-ignore
    timeStr = dayjs(time).fromNow()
  }

  let ispc = info.platform === 'mac' || info.platform === 'windows'

  return (
    <Card onClick={jumptoWebview} className={ispc && selected ? s.selected : ''}>
      <View className={s.title_wrap}>
        <View className={s.title}>{title}</View>
        {type === 'new' && <Tag text='new' type='new' />}
      </View>

      <View className={s.top}>
        <div style={{flex: 1}}>
          <View className={s.desc}>{description}</View>
          <div id={s.footer}>
            <View className={s.user_info}>
              <Image
                fadeIn className={s.avatar}
                src='cloud://develop-3gnhbrj323546fde.6465-develop-3gnhbrj323546fde-1258315057/WechatIMG192.jpg'
              />
              <View className={s.author}>{author}</View>
            </View>
            <View className={s.read_count}>
              <View className={s.time}>{timeStr}</View>
            </View>
          </div>
        </div>
        {type === 'important' ? (
          <Button id={s.btn} size='mini' onClick={__jumptoAlbum}>
            <Icon name="rect_255" style={{marginRight: 'var(--px4)'}} size={18} />
            阅读合集
          </Button>
        ) : null}
      </View>
    </Card>
  )
}

export default ArticleItem;
